import $ from "jquery";

const el = $(".app-countdown");

function createNumber() {
    var div = $(`<div class="app-numbers"></div>`);
    var nums = $(`<div></div>`);
    for (let i = 0; i < 10; i++) {
        $(`<div></div>`).text(i).appendTo(nums);
    }
    div.append(nums);
    el.append(div[0]);
    return {
        type: "num",
        $el: div, $child: nums,
        set(num) {
            if (isNaN(Number(num))) return;
            num = Number(num);
            if (Number(num) > 9 || Number(num) < 0) return;
            if (nums.css("transform") !== `translateY(-${num * 45}px)`) {
                nums.css("transform", `translateY(-${num * 45}px)`)
            }
        }
    }
};

function createString(str) {
    var div = $(`<div class="app-stirng"></div>`);
    div.text(str);
    el.append(div[0]);
    return {
        type: "str",
        $el: div,
        set(str) {
            div.text(str)
        }
    }
};

export { createNumber as num, createString as str, el }